import React, { Component } from 'react';

interface IState {
  name: string;
}

// 第一个是props 约束，后面是状态约束
class App extends Component<any, IState> {
  state = {
    name: 'zhang san',
  };

  render() {
    return (
      <div>
        <h1>App</h1>
        <button onClick={() => this.setState({ name: 'li si' })}>click</button>
        {/* <button onClick={() => this.setState({ name: 100 })}>click</button>  */}
        <p>
          {this.state.name.substring(0, 1).toUpperCase() +
            this.state.name.substring(1)}
        </p>
      </div>
    );
  }
}
export default App;
